<!DOCTYPE HTML>
<html lang="en">
<head>
    <meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
    <link rel="icon" type="image/x-icon" href="img/head/favicon.ico" />
    <link rel="stylesheet" href="css/login.css"/>
    <meta name="keywords" content="网上商城, 电商平台, 能源互联网">
    <meta name="description" content="能源互联网, 网上商城, 电商平台, 电子商务, 掌上e宝, 科技金服, 不正经网站研究中心">
    <title>欢迎登录网上商城</title>
    <noscript>抱歉，你的浏览器不支持 JavaScript!</noscript>
    <script type="text/javascript" src="js/common/jquery-1.11.3.min.js"></script>
    <style>
        .button {
            display: inline-block;
            border-radius: 18px;
            background-color: #009992;
            border: none;
            color: #FFFFFF;
            text-align: center;
            font-size: 20px;
            padding: 8px;
            width: 100px;
            transition: all 0.5s;
            cursor: pointer;
            margin: -20px;
        }

        .button span {
            cursor: pointer;
            display: inline-block;
            position: relative;
            transition: 0.5s;
        }

        .button span:after {
            content: '»';
            position: absolute;
            opacity: 0;
            top: 0;
            right: 60px;
            transition: 0.5s;
        }

        .button:hover span {
            padding-right: 25px;
        }

        .button:hover span:after {
            opacity: 1;
            right: 0;
        }
    </style>
</head>
<body>
<img src="./img/head/logo.png" alt="logo" style="position: absolute;top: 8%;left: 12%;">
<h1>欢迎登陆网上商城</h1>
<form id="myForm" m>
    <table>
        <tr>
            <td colspan="2" style="color: red;text-align: center;" class="tdx" id="alert"></td>
        </tr>
        <tr>
            <td class="tdx"><label >用&nbsp;户&nbsp;名：</label></td>
            <td>
                <input type="text" id="name" name="user_name" />
                <span style="color:red"></span>
            </td>
        </tr>
        <tr>
            <td class="tdx"><label >密&nbsp;&nbsp;&nbsp;码：</label></td>
            <td>
                <input type="password" name="user_password" id="password"/>
                <span style="color:red"></span>
            </td>
        </tr>
        <tr>
            <td class="tdx"><label >验&nbsp;证&nbsp;码：</label></td>
            <td>
                <input type="text" name="code" id="code"/>
                <img src="code" onclick="this.src=this.src+'?'+Math.random()" id="img"><br/>

              <span style="color:#ff0000"></span>
            </td>
        </tr>
  <!--      <tr>
            <td colspan="2" style="text-align: center;">

            </td>
        </tr>-->
        <tr>
              <td></td>
            <td  >

                   <!-- <button type="button" onclick="deng()" >登录</button>-->

              <!-- <center> </center>-->
            <pre>        <button class="button" type="button" style="vertical-align:middle" onclick="deng()" ><span>登录 </span></button></pre>
            </td>
        </tr>
    </table>
</form>
</body>

<script>
    function deng(){

        $.ajax({
            url:"loginUser",
            type:'post',
            data:$("#myForm").serialize(),
            success:function(data){
            console.log(data)
                alert(data.message)
                if(data.code==200){
                    var name=$("#name").val();
                    sessionStorage.setItem("name",name);
                    location.href="index.html"
                }else{
                    alert("失败")
                }
            },error:function (data){
                alert(data.message)
                if(data.code==200){
                    location.href="index1.html"
                }else{
                    alert("失败")

                }
            }
        })
    }


</script>
</html>